<template>
  <div>
    <div class="row-header">
      <el-form :model="searchForm" ref="searchForm" label-width="50px">
        <el-form-item label=" " prop="dictPayTypeFlag">
          <el-select v-model="searchForm.dictPayTypeFlag" placeholder="请选择操作方式">
            <el-option v-for="(item,index) in dictPayTypeFlagOptions"
                       :key="index" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="row-form-btn">
        <el-button type="shenda" size="mini" icon="el-icon-search" @click="currentPage=1;initData()">查询</el-button>
        <el-button size="mini" type="shenda" icon="el-icon-refresh-right" @click="resetForm('searchForm')">重置</el-button>
      </div>
    </div>
    <div class="split-line"></div>
    <div class="row-main">
      <el-button type="shenda" icon="el-icon-plus" @click="addPayWey">添加付款支付方式</el-button>
      <el-button type="shenda" icon="el-icon-plus" @click="addCashOutWey" v-if="roleChar=='OEM_ADMIN'">添加提现付款方式</el-button>
      <el-row style="margin-top: 20px;font-size: 16px">付款方式列表：</el-row>
      <el-table :header-cell-style="{ 'background':$store.state.app.tableBgColor,'color':'#606266' }" :data="tableData" tooltip-effect="dark" class="row-main-table"
                v-loading.fullscreen="tableLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)" ref="table">
        <el-table-column prop="paymentHeadName" label="支付方式" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="paymentName" label="支付通道" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="dictStatusName" label="是否开启" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'">
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.dictStatus=='C_YES'?true:false"
              active-text=""
              inactive-text=""
              @change="changePayWay(scope.row)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column prop="dictPayTypeFlagName" label="操作方式" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="insertTimeTime" label="添加时间" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="appid" label="APPID" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column v-has="'orderCtrl'" prop="dictStatus" label="操作" align="center">
          <template slot-scope="scope">
            <el-dropdown trigger="click">
              <div>
                <svg-icon class="el-dropdown-link" icon-class="operation"></svg-icon>
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="updatePayWay(scope.row)" v-preventReClick>编辑</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="deletePayWay(scope.row)" v-preventReClick>删除</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="openPayWay(scope.row)" v-preventReClick v-if="scope.row.dictStatus=='C_NO'">开启</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="closePayWay(scope.row)" v-preventReClick v-if="scope.row.dictStatus=='C_YES'">关闭</el-button>
                </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <div :style="{'overflow-x': $store.state.app.screenWidth<992?'scroll':'none'}">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="pageSize"
          class="row-main-pager"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          :page-sizes="[10,20,50,100]"
          background></el-pagination>
      </div>
      <el-row style="margin-top: 20px;font-size: 16px" v-if="roleChar=='OEM_ADMIN'">提现付款方式列表：</el-row>
      <el-table :header-cell-style="{ 'background':$store.state.app.tableBgColor,'color':'#606266' }" :data="cashOutTableData" tooltip-effect="dark" class="row-main-table" v-if="roleChar=='OEM_ADMIN'"
                v-loading.fullscreen="tableLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)" ref="table">
        <el-table-column prop="paymentName" label="自定义支付名称" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="dictWithdrawalTypeName" label="支付方式" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="dictStatus" label="是否开启" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'">
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.dictStatus=='C_YES'?true:false"
              active-text=""
              inactive-text=""
              @change="switchCashOutWay(scope.row)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column prop="insertTimeTime" label="添加时间" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column prop="appid" label="APPID" align="center" :fixed="$store.state.app.screenWidth<992?true:false" :width="$store.state.app.screenWidth<992?'130px':'auto'"></el-table-column>
        <el-table-column v-has="'orderCtrl'" prop="dictStatus" label="操作" align="center">
          <template slot-scope="scope">
            <el-dropdown trigger="click">
              <div>
                <svg-icon class="el-dropdown-link" icon-class="operation"></svg-icon>
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="updateCashOutWay(scope.row)" v-preventReClick>编辑</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="deleteCashOutWay(scope.row)" v-preventReClick>删除</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="openCashOutWay(scope.row)" v-preventReClick v-if="scope.row.dictStatus=='C_NO'">开启</el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button class="operation" type="text" @click="closeCashOutWay(scope.row)" v-preventReClick v-if="scope.row.dictStatus=='C_YES'">关闭</el-button>
                </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <!--  添加提现付款方式  -->
    <el-dialog
      :title="title"
      :visible.sync="addCashOutDialogVisible"
      width="700px"
      center>
      <el-form :model="cashOutForm" ref="cashOutForm" :rules="cashOutRules" label-width="300px">
        <el-form-item label="支付方式" prop="payWay">
          <el-radio-group v-model="cashOutForm.payWay" :disabled="id!==''" @change="">
            <el-radio v-for="item in cashOutWay" :label="item.value" :key="item.id">{{ item.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item prop="paymentName" label="自定义打款方式名称">
          <el-input v-model.trim="cashOutForm.paymentName"/>
        </el-form-item>
        <el-form-item prop="appid" label="APPID">
          <el-input v-model.trim="cashOutForm.appid"/>
        </el-form-item>
        <el-form-item prop="appsecret" label="APPSECRET" v-if="cashOutForm.payWay=='WEIXIN'&&form.dictPayTypeFlagList!='H5'">
          <el-input v-model.trim="cashOutForm.appsecret"/>
        </el-form-item>
        <el-form-item prop="mch_id" label="商户号 mch_id" v-if="cashOutForm.payWay=='WEIXIN'">
          <el-input v-model.trim="cashOutForm.mch_id"/>
        </el-form-item>

        <el-form-item prop="shopKey" label="商户key" v-if="cashOutForm.payWay=='WEIXIN'">
          <el-input type="textarea" v-model="cashOutForm.shopKey"/>
        </el-form-item>
        <el-form-item prop="keyV3" label="keyV3" v-if="cashOutForm.payWay=='WEIXIN'">
          <el-input v-model.trim="cashOutForm.keyV3"/>
        </el-form-item>
        <el-form-item prop="证书序列号" label="证书序列号" v-if="cashOutForm.payWay=='WEIXIN'">
          <el-input v-model.trim="cashOutForm.mchSerialNo"/>
        </el-form-item>
        <el-form-item prop="fileName2" label="证书文件" v-if="cashOutForm.payWay=='WEIXIN'&&!id">
          <el-button type="primary">上传证书文件</el-button>
          <input type="file" @change="uploadFile(2)" class="uploadClass" id="file2" ref="file2"/>
          <span v-if="cashOutForm.fileName2" style="margin: 10px">{{ cashOutForm.fileName2 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName7" label="证书文件" v-if="cashOutForm.payWay=='WEIXIN'&&id">
          <el-button type="primary">上传p.12证书文件</el-button>
          <input type="file" @change="uploadFile(7)" class="uploadClass" id="file7" ref="file2"/>
          <span v-if="cashOutForm.fileName7" style="margin: 10px">{{ cashOutForm.fileName7 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>

        <el-form-item prop="fileName20" label="上传私钥证书" >
          <el-button type="primary">上传私钥证书</el-button>
          <input type="file" @change="uploadFile(20)" class="uploadClass" id="file20" ref="file20"/>
          <span v-if="cashOutForm.fileName20" style="margin: 10px">{{ cashOutForm.fileName20 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>

        <el-form-item prop="fileName3" label="支付宝公钥证书（alipay public key cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'&&!id">
          <el-button type="primary">上传支付宝公钥证</el-button>
          <input type="file" @change="uploadFile(3)" class="uploadClass" id="file3" ref="file3"/>
          <span v-if="cashOutForm.fileName3" style="margin: 10px">{{ cashOutForm.fileName3 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName3" label="支付宝应用私钥（private Key）" v-if="cashOutForm.payWay=='ZHIFUBAO'&&!id">
          <el-button type="primary">上传支付宝应用私钥</el-button>
          <input type="file" @change="uploadFile(6)" class="uploadClass" id="file6" ref="file6"/>
          <span v-if="cashOutForm.fileName6" style="margin: 10px">{{ cashOutForm.fileName6 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName4" label="应用公钥证书（public key cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'&&!id">
          <el-button type="primary">应用公钥证书</el-button>
          <input type="file" @change="uploadFile(4)" class="uploadClass" id="file4" ref="file4"/>
          <span v-if="cashOutForm.fileName4" style="margin: 10px">{{ cashOutForm.fileName4 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName5" label="支付宝根证书（alipay root cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'&&!id">
          <el-button type="primary">支付宝根证书</el-button>
          <input type="file" @change="uploadFile(5)" class="uploadClass" id="file5" ref="file5"/>
          <span v-if="cashOutForm.fileName5" style="margin: 10px">{{ cashOutForm.fileName5 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName8" label="支付宝公钥证书（alipay public key cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'">
          <el-button type="primary">上传支付宝公钥证</el-button>
          <input type="file" @change="uploadFile(8)" class="uploadClass" id="file8" ref="file3"/>
          <span v-if="cashOutForm.fileName8" style="margin: 10px">{{ cashOutForm.fileName8 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName9" label="支付宝应用私钥（private Key）" v-if="cashOutForm.payWay=='ZHIFUBAO'">
          <el-button type="primary">上传支付宝应用私钥</el-button>
          <input type="file" @change="uploadFile(9)" class="uploadClass" id="file9" ref="file6"/>
          <span v-if="cashOutForm.fileName9" style="margin: 10px">{{ cashOutForm.fileName9 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName10" label="应用公钥证书（public key cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'">
          <el-button type="primary">应用公钥证书</el-button>
          <input type="file" @change="uploadFile(10)" class="uploadClass" id="file10" ref="file4"/>
          <span v-if="cashOutForm.fileName10" style="margin: 10px">{{ cashOutForm.fileName10 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName11" label="支付宝根证书（alipay root cert）" v-if="cashOutForm.payWay=='ZHIFUBAO'">
          <el-button type="primary">支付宝根证书</el-button>
          <input type="file" @change="uploadFile(11)" class="uploadClass" id="file11" ref="file5"/>
          <span v-if="cashOutForm.fileName11" style="margin: 10px">{{ cashOutForm.fileName11 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item label="是否立即开启打款方式" prop="dictStatus">
          <el-radio-group v-model="cashOutForm.dictStatus" :disabled="id!==''">
            <el-radio-button label="C_YES">开启</el-radio-button>
            <el-radio-button label="C_NO">关闭</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item>
          <el-button @click="onsubmitCashOutForm" type="primary" v-preventReclick>提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--  添加支付方式  -->
    <el-dialog
      :title="title"
      :visible.sync="addDialogVisible"
      width="600px"
      center>
      <el-form :model="form" ref="form" :rules="rules" label-width="220px">
        <el-form-item label="支付方式" prop="payWay">
          <el-radio-group v-model="form.payWay" :disabled="id!==''" @change="changePayWayRadio">
            <el-radio v-for="item in payWayList" :label="item.value" :key="item.id">{{ item.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="收款方式" prop="dictPayTypeFlagList">
          <el-radio-group v-model="form.dictPayTypeFlagList" :disabled="id!==''">
            <el-radio label="JSAPI" :disabled="payFlagDisplay.JSAPI" style="height: 40px;line-height: 40px">公众号支付</el-radio>
            <el-radio label="NATIVE" :disabled="payFlagDisplay.NATIVE" style="height: 40px;line-height: 40px">扫码支付</el-radio>
            <el-radio label="H5" :disabled="payFlagDisplay.H5" style="height: 40px;line-height: 40px">H5支付</el-radio>
            <el-radio label="AND_PAY" :disabled="payFlagDisplay.ANDROID" style="height: 40px;line-height: 40px">安卓</el-radio>
          </el-radio-group>
        </el-form-item>
        <!--    配置微信支付信息    -->
        <el-form-item label="自定义支付名称" prop="paymentName" v-if="form.payWay=='1'">
          <el-input v-model.trim="form.paymentName"/>
        </el-form-item>
        <el-form-item label="支付通道" prop="payAccount" v-if="form.payWay=='2'||form.payWay=='3'">
          <el-radio-group v-model="form.payAccount" @change="changePayAccount">
            <el-radio label="WXZF">微信</el-radio>
            <el-radio label="ZFBZF" disabled>支付宝</el-radio>
            <el-radio label="UPSMSF" disabled>银联</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="APPID" prop="APPID" v-if="form.payWay=='3'||form.payWay=='1'||form.payAccount=='WXZF'||form.payWay=='4'">
          <el-input v-model.trim="form.APPID"/>
        </el-form-item>
        <el-form-item label="secret(公钥)" prop="secret" v-if="(form.payWay!='2'&&form.dictPayTypeFlagList!='H5')||form.payWay=='3'">
          <el-input type="textarea" v-model="form.secret"/>
        </el-form-item>
        <el-form-item label="商户号 mch_id" prop="mchId" v-if="(form.payWay=='1'||form.payWay=='3'||form.payAccount=='WXZF')">
          <el-input v-model.trim="form.mchId"/>
        </el-form-item>
        <el-form-item label="商户key(或prod模式API_KEY)" prop="appKey" v-if="(form.payWay=='1'||form.payAccount=='WXZF')&&form.dictPayTypeFlagList!='H5'&&form.payWay!='3'">
          <el-input type="textarea" v-model.trim="form.appKey"/>
        </el-form-item>
        <el-form-item label="密钥(私钥)/汇付apiKey" prop="shopKey" v-if="(form.payWay=='1'||form.payWay=='3'||form.payAccount=='WXZF'||form.payWay=='3'||form.payWay=='4')">
          <el-input type="textarea" v-model.trim="form.shopKey"/>
        </el-form-item>
<!--        <el-form-item label="RSA公钥" prop="secret" v-if="form.payWay=='3'">
          <el-input type="textarea" v-model="form.secret"/>
        </el-form-item>
        <el-form-item label="移动应用APPID" prop="secret" v-if="form.payWay=='3'">
          <el-input type="textarea" v-model="form.mch_id"/>
        </el-form-item>-->
        <el-form-item label="小程序APPID" prop="andName"  v-if="form.payWay=='2'||form.payWay=='4'">
          <el-input v-model="form.andName" />
        </el-form-item>
        <el-form-item label="小程序原始ID" prop="smallProgtamOrginalid"  v-if="form.payWay=='2'||form.payWay=='4'">
          <el-input v-model="form.smallProgtamOrginalid" />
        </el-form-item>
        <el-form-item label="小程序secret" prop="andValue" v-if="form.payWay=='2'||form.payWay=='4'">
          <el-input type="textarea" v-model="form.andValue" />
        </el-form-item>

        <el-form-item label="keyV3/汇付私钥" prop="keyV3" v-if="form.payWay=='1'||form.payWay=='4'">
          <el-input  v-model="form.keyV3" />
        </el-form-item>
        <el-form-item label="证书序列号" prop="mchSerialNo" v-if="form.payWay=='1'">
          <el-input v-model="form.mchSerialNo" />
        </el-form-item>

        <el-form-item :label="form.dictPayTypeFlagList!='H5'?'证书文件(apiclient_cert.p12)':'证书文件(apiclient_cert.pem)'" >
          <el-button type="primary">上传证书文件</el-button>
          <input type="file" @change="uploadCertificateFile(1,1)" class="uploadClass" id="file1" ref="file1"/>
          <span v-if="form.fileName1" style="margin: 10px">{{ form.fileName1 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>

        <el-form-item label="上传私钥证书'" >
          <el-button type="primary">上传私钥证书</el-button>
          <input type="file" @change="uploadCertificateFile(4,14)" class="uploadClass" id="file14" ref="file14"/>
          <span style="margin: 10px">{{ form.fileName4 }}</span>
        </el-form-item>

        <el-form-item prop="fileName2" label="私钥文件(apiclient_key.pem)" v-if="form.payWay=='1'&&form.dictPayTypeFlagList=='H5'&&!id">
          <el-button 7type="primary">上传私钥文件</el-button>
          <input type="file" @change="uploadCertificateFile(2,12)" class="uploadClass" id="file12" ref="file12"/>
          <span v-show="form.fileName2" style="margin: 10px">{{ form.fileName2 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item prop="fileName3" label="私钥文件(apiclient_key.pem)" v-if="form.payWay=='1'&&form.dictPayTypeFlagList=='H5'&&id">
          <el-button type="primary">修改私钥文件</el-button>
          <input type="file" @change="uploadCertificateFile(3,13)" class="uploadClass" id="file13" ref="file13"/>
          <span v-show="form.fileName3" style="margin: 10px">{{ form.fileName3 }}<i class="el-icon-success" style="color: green;margin: 10px"></i></span>
        </el-form-item>
        <el-form-item label="是否立即开启支付方式" prop="dictStatus">
          <el-radio-group v-model="form.dictStatus" :disabled="id!==''">
            <el-radio-button label="C_YES">开启</el-radio-button>
            <el-radio-button label="C_NO">关闭</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <div style="color: darkred;text-indent: 100px" v-if="id">*若当前支付方式已产生订单，修改商户号后将导致无法退款！</div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onsubmit('form')" v-preventReClick>确 定</el-button>
      </span>
    </el-dialog>
  </div>

</template>
<script>
import {getPayWay, getOemPayWay, saveOemPayWay, deleteOemPayWay, updateOemPayWay, addCashOutWay, getCashOutWay, deleteOemCashOutWay} from '@/api/getData'

export default {
  name: 'index',
  data() {
    return {
      payWayList: [],
      defaultPayWay: '',
      showNextBtn: false,
      showPrevBtn: false,
      showSubmitBtn: false,
      addDialogVisible: false,
      addCashOutDialogVisible: false,
      form: {
        payWay: '',
        paymentName: '',
        APPID: '',
        mchId: '',
        appKey: '',
        shopKey: '',
        secret: '',
        mpFile: null,
        gzh: null,
        payAccount: 'WXZF',
        dictStatus: 'C_YES',
        dictPayTypeFlagList: [],
        fileName1: '',
        fileName2: '',
        fileName3: '',
        fileName4: '',
        certificateFile1: null,
        certificateFile2: '',
        certificateFile3: '',
        certificateFile4: null,
        smallProgtamOrginalid:'',
        mchSerialNo: "",
        keyV3: ""
      },
      rules: {
        paymentName: [{required: true, message: '请输入自定义名称', trigger: 'blur'}],
        payWay: [{required: true, message: '请选择支付方式', trigger: 'change'}],
        APPID: [{required: true, message: '请输入APPID', trigger: 'blur'}],
        secret: [{required: true, message: '请输入secret', trigger: 'blur'}],
        mchId: [{required: true, message: '请输入微信商户号', trigger: 'blur'}],
        appKey: [{required: true, message: '请输入商户key', trigger: 'blur'}],
        shopKey: [{required: true, message: '请输入APIv3密钥', trigger: 'blur'}],
        dictPayTypeFlagList: [{required: true, message: '请配置收款方式', trigger: 'change'}],
        fileName2: [{required: true, message: '请上传私钥文件', trigger: 'change'}],
      },
      cashOutForm: {
        payWay: 'WEIXIN',
        paymentName: '',
        shopKey: '',
        mch_id: '',
        appid: '',
        appsecret: '',
        fileName2: '',
        fileName3: '',
        fileName4: '',
        fileName5: '',
        fileName6: '',
        fileName7: '',
        fileName8: '',
        fileName9: '',
        fileName10: '',
        fileName11: '',
        fileName20: '',
        certificateFile2: '',
        certificateFile3: '',
        certificateFile4: '',
        certificateFile5: '',
        certificateFile6: '',
        certificateFile7: '',
        certificateFile8: '',
        certificateFile9: '',
        certificateFile10: '',
        certificateFile11: '',
        dictStatus: 'C_YES',
        certificateFile20: '',
        mchSerialNo:'',
        keyV3: '',
      },
      cashOutRules: {
        paymentName: [{required: true, message: '请输入自定义支付名称', trigger: 'blur'}],
        appid: [{required: true, message: '请输入APPID', trigger: 'blur'}],
        mch_id: [{required: true, message: '请输入商户号 mch_id', trigger: 'blur'}],
        appsecret: [{required: true, message: '请输入APPSECRET', trigger: 'blur'}],
        shopKey: [{required: true, message: '请输入shopKey', trigger: 'blur'}],
        fileName2: [{required: true, message: '请上传证书文件', trigger: 'blur'}],
        fileName3: [{required: true, message: '请上传支付宝公钥证', trigger: 'blur'}],
        fileName4: [{required: true, message: '请上传应用公钥证书', trigger: 'blur'}],
        fileName5: [{required: true, message: '请上传支付宝根证书', trigger: 'blur'}],

      },
      cashOutWay: [
        {value: 'WEIXIN', label: '微信'},
        // { value: 'ZHIFUBAO', label: '支付宝' }
      ],
      id: '',
      title: '',
      pagekey: '',
      tableData: [],
      total: 0,
      currentPage: 1,
      pageSize: 10,
      tableLoading: false,
      payMethod: [],  //当前已配置的第三方支付方式，存入的小类名称
      searchForm: {
        dictPayTypeFlag: '',
      },
      dictPayTypeFlagOptions: [
        {value: '', label: '请选择操作方式'},
        {value: 'JSAPI', label: '公众号支付'},
        {value: 'NATIVE', label: '二维码支付'},
        {value: 'H5', label: 'H5支付'},
      ],
      cashOutTableData: [],
      roleChar: '',
      disable: false,
      payFlagDisplay:{
        JSAPI:false,
        NATIVE:false,
        H5:false,
        ANDROID:true
      }
    }
  },
  async mounted() {
    this.pagekey = await this.$getPageKey();
    let returnData = await getPayWay({})
    if (returnData._result) {
      this.payWayList = [];
      for (let item of returnData.data) {
        this.payWayList.push({value: item.id, label: item.paymentHeadName, disabled: false})
      }
      this.form.payWay = this.payWayList[0].value;
      this.defaultPayWay = this.payWayList[0].value;
    }
    this.roleChar = localStorage.getItem("roleChar");
    this.initData();

    if (this.roleChar == 'OEM_ADMIN') {
      this.initCashOutData();
    }

  },
  methods: {
    async initData() {
      let returnData = await getOemPayWay({
        dictPayTypeFlag: this.searchForm.dictPayTypeFlag,
        page: {
          current: this.currentPage + '',
          size: this.pageSize + ''
        }
      });
      this.tableData = [];
      this.total = 0;
      this.payMethod = new Set();
      if (returnData.data.records) {
        for (let item of returnData.data.records) {
          this.tableData.push(item);
          this.payMethod.add({[item.paymentHeadId]: item.payType});
        }
        this.payMethod = Array.from(this.payMethod)
        this.total = returnData.data.total;
      }
    },
    async initCashOutData() {
      let returnData = await getCashOutWay({dictStatus: ''});
      if (returnData.code == 10000 && returnData.data) {
        this.cashOutTableData = [];
        for (let item of returnData.data) {
          let obj = {};
          obj.id = item.id;
          obj.paymentName = item.paymentName;
          obj.appid = item.appid;
          obj.dictWithdrawalTypeName = item.dictWithdrawalTypeName;
          obj.dictStatus = item.dictStatus;
          obj.insertTime = item.insertTime;
          this.cashOutTableData.push(item)
        }
      }
    },
    // //开启or关闭打款方式
    async switchCashOutWay(row) {
      this.pagekey = await this.$getPageKey();
      if (row.dictStatus == 'C_YES') {
        this.closeCashOutWay(row)
      } else {
        this.openCashOutWay(row)
      }
    },

    async addCashOutWey() {
      this.title = '新增付款支付方式';
      this.id = '';
      this.cashOutForm = {
        appid: '',
        mch_id: '',
        appsecret: '',
        dictStatus: '',
        payWay: 'WEIXIN',
        paymentName: '',
        shopKey: '',
        fileName2: '',
        fileName3: '',
        fileName4: '',
        fileName5: '',
        fileName6: '',
        fileName7: '',
        fileName8: '',
        fileName9: '',
        fileName10: '',
        fileName11: '',
        certificateFile2: '',
        certificateFile3: '',
        certificateFile4: '',
        certificateFile5: '',
        certificateFile6: '',
        certificateFile7: '',
        certificateFile8: '',
        certificateFile9: '',
        certificateFile10: '',
        certificateFile11: '',
        certificateFile14: '',
        mchSerialNo:'',
        keyV3: '',
      }
      this.addCashOutDialogVisible = true;
      this.pagekey = await this.$getPageKey()
    },
    async updateCashOutWay(row) {
      this.id = row.id;
      this.title = '修改付款支付方式';
      this.pagekey = await this.$getPageKey()
      this.cashOutForm = {
        appid: row.appid,
        mch_id: row.mch_id,
        appsecret: row.secret,
        dictStatus: row.dictStatus,
        payWay: row.dictWithdrawalType,
        paymentName: row.paymentName,
        mchSerialNo: row.mchSerialNo,
        keyV3: row.keyV3,
        shopKey: row.shopKey,
        fileName2: '',
        fileName3: '',
        fileName4: '',
        fileName5: '',
        fileName6: '',
        fileName7: '',
        fileName8: '',
        fileName9: '',
        fileName10: '',
        fileName11: '',
        certificateFile2: '',
        certificateFile3: '',
        certificateFile4: '',
        certificateFile5: '',
        certificateFile6: '',
        certificateFile7: '',
        certificateFile8: '',
        certificateFile9: '',
        certificateFile10: '',
        certificateFile11: '',
      }
      this.addCashOutDialogVisible = true;
    },
    resetCashOutForm() {
      this.$refs['cashOutForm'].resetFields();
    },

    async onsubmitCashOutForm() {
      this.$refs['cashOutForm'].validate(async valid => {
        if (valid) {
          let payment = {};
          payment.id = this.id;
          payment.appid = this.cashOutForm.appid;
          payment.paymentName = this.cashOutForm.paymentName;
          payment.dictWithdrawalType = this.cashOutForm.payWay;
          payment.privateKey = this.cashOutForm.certificateFile20;
          payment.mchSerialNo = this.cashOutForm.mchSerialNo;
          payment.keyV3 = this.cashOutForm.keyV3;
          if (this.cashOutForm.payWay == 'WEIXIN') {
            payment.secret = this.cashOutForm.appsecret;
            // payment.key = this.id?this.cashOutForm.certificateFile7:this.cashOutForm.certificateFile2;
            payment.mch_id = this.cashOutForm.mch_id;
            payment.shopKey = this.cashOutForm.shopKey;
            if (this.id && this.cashOutForm.certificateFile7) {
              payment.key = this.cashOutForm.certificateFile7;
            }
            if (!this.id) {
              payment.key = this.cashOutForm.certificateFile2;
            }
          }
          if (this.cashOutForm.payWay == 'ZHIFUBAO') {
            // payment.alipayCert = this.id?this.cashOutForm.certificateFile8:this.cashOutForm.certificateFile3;
            // payment.appCert = this.id?this.cashOutForm.certificateFile10:this.cashOutForm.certificateFile4;
            // payment.alipayRootCert = this.id?this.cashOutForm.certificateFile11:this.cashOutForm.certificateFile5;
            // payment.privateKey = this.id?this.cashOutForm.certificateFile9:this.cashOutForm.certificateFile6;
            if (this.id && this.cashOutForm.certificateFile8) {
              payment.alipayCert = this.cashOutForm.certificateFile8;
            }
            if (!this.id) {
              payment.alipayCert = this.cashOutForm.certificateFile3;
            }
            if (this.id && this.cashOutForm.certificateFile10) {
              payment.appCert = this.cashOutForm.certificateFile10;
            }
            if (!this.id) {
              payment.appCert = this.cashOutForm.certificateFile4;
            }
            if (this.id && this.cashOutForm.certificateFile11) {
              payment.alipayRootCert = this.cashOutForm.certificateFile11;
            }
            if (!this.id) {
              payment.alipayRootCert = this.cashOutForm.certificateFile5;
            }
            if (this.id && this.cashOutForm.certificateFile9) {
              payment.privateKey = this.cashOutForm.certificateFile9;
            }
            if (!this.id) {
              payment.privateKey = this.cashOutForm.certificateFile6;
            }
          }
          let returnData = await addCashOutWay(payment, {
            pagekey: this.pagekey,
          })
          if (returnData.code == 10000) {
            this.addCashOutDialogVisible = false;
            this.$message({
              type: 'success',
              message: '数据提交成功'
            })
            this.initCashOutData();
          }
        }
      })

    },
    changePayAccount(val) {
      this.form.payAccount = val;
      let obj = this.payWayList.filter(item => {
        if (item.value = this.form.payWay) return item
      })
      let name = obj.label + '：';
      switch (val) {
        case "WXZF":
          name += '微信';
          break;
        case "ZFBZF":
          name += '支付宝';
          break;
        case "UPSMSF":
          name += '银联';
      }
      let index = this.methods.indexOf(obj.label);
      if (index > -1) {
        this.$message('您已选择过该种支付方式，请勿重复配置')
      }
    },
    async addPayWey() {
      this.addDialogVisible = true;
      this.title = '添加支付方式';
      this.pagekey = await this.$getPageKey();
      this.form.payWay = this.payWayList[0].value;
      this.id = '';
      if (this.$refs.file) {
        this.$refs.file.value = '';
      }
      this.form = {
        payWay: this.defaultPayWay,
        paymentName: '',
        APPID: '',
        mchId: '',
        appKey: '',
        secret: '',
        mpFile: null,
        gzh: null,
        fileName1: '',
        fileName2: '',
        fileName3: '',
        certificateFile1: null,
        certificateFile2: '',
        certificateFile3: '',
        payAccount: 'WXZF',
        dictStatus: 'C_YES',
        dictPayTypeFlagList: 'JSAPI',
        certificateFile4: null,
        mchSerialNo:'',
        keyV3: '',
      }

    },
    async updatePayWay(row) {
      this.addDialogVisible = true;
      this.title = '修改支付方式';
      this.id = row.id;
      if (this.$refs.file) {
        this.$refs.file.value = '';
      }
      this.form = {
        payWay: row.paymentHeadId,
        paymentName: row.paymentName,
        APPID: row.appid,
        mchId: row.mch_id,
        appKey: row.shopKey,
        shopKey: row.shopKey,
        secret: row.secret,
        payAccount: row.payType,
        dictStatus: row.dictStatus,
        dictPayTypeFlagList: row.dictPayTypeFlag,
        fileName1: '',
        fileName2: '',
        fileName3: '',
        certificateFile1: null,
        certificateFile2: '',
        certificateFile3: '',

        andName:row.andName,
        andValue:row.andValue,
        smallProgtamOrginalid:row.smallProgtamOrginalid,
        gzh: null,
        certificateFile4: null,
        mchSerialNo:row.mchSerialNo,
        keyV3: row.keyV3,
      }
      console.log(row)
      console.log(this.form)
      this.pagekey = await this.$getPageKey();
    },
    uploadCertificateFile(i,t) {
      this.form['certificateFile'+i] = document.getElementById('file'+t).files[0];
      console.log("aa:"+this.form['certificateFile'+i].name)
      this.form['fileName'+i] = this.form['certificateFile'+i].name;
      console.log("bb:"+ this.form['fileName'+i])
      console.log(this.form)
    },
    uploadFile(i) {
      this.cashOutForm['certificateFile' + i] = document.getElementById('file' + i).files[0];
      this.cashOutForm['fileName' + i] = this.cashOutForm['certificateFile' + i].name;
    },

    async openCashOutWay(row) {
      this.$confirm('是否立即开启当前付款方式？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await addCashOutWay({
          id: row.id,
          dictStatus: 'C_YES',

        }, {pagekey: this.pagekey})
        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '付款方式开启成功!'
          });
          this.pagekey = await this.$getPageKey();
          this.initCashOutData()
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },
    async closeCashOutWay(row) {
      this.$confirm('是否立即关闭当前付款方式？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await addCashOutWay({
          id: row.id,
          dictStatus: 'C_NO',
        }, {pagekey: this.pagekey})
        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '付款方式关闭成功!'
          });
          this.initCashOutData()
        }
        this.pagekey = await this.$getPageKey();
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },

    // uploadWeChatFile(){
    //   this.form.mpFile = document.getElementById('file2').files[0];
    //   this.form.mpName = document.getElementById('file2').files[0].name;
    // },
    async deleteCashOutWay(row) {
      this.$confirm('此操作将永久删除该数据, 删除后会导致该付款方式无法自动提现， 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await deleteOemCashOutWay({
          id: row.id,
          pagekey: this.pagekey
        })

        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          this.initCashOutData()
        }
        this.pagekey = await this.$getPageKey();
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    async deletePayWay(row) {
      this.$confirm('此操作将永久删除该数据, 删除后会导致该支付方式下订单无法退款， 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await deleteOemPayWay({
          id: row.id,
          pagekey: this.pagekey
        })
        this.pagekey = await this.$getPageKey();
        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          this.initData()
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    changePayWay(row) {
      if (row.dictStatus == 'C_YES') {
        this.closePayWay(row)
      } else {
        this.openPayWay(row)
      }
    },
    async openPayWay(row) {
      this.$confirm('是否立即开启当前支付方式？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await updateOemPayWay({
          id: row.id,
          dictStatus: 'C_YES',

        }, {pagekey: this.pagekey})
        this.pagekey = await this.$getPageKey();
        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '支付方式开启成功!'
          });
          this.initData()
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },
    async closePayWay(row) {
      this.$confirm('是否立即关闭当前支付方式？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let returnData = await updateOemPayWay({
          id: row.id,
          dictStatus: 'C_NO',
        }, {pagekey: this.pagekey})
        this.pagekey = await this.$getPageKey();
        if (returnData.code == 10000) {
          this.$message({
            type: 'success',
            message: '支付方式关闭成功!'
          });
          this.initData()
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },

    onsubmit(form) {
      let _this = this;

      this.$refs[form].validate(async (valid) => {
        if (valid) {
          let payType = '';
          if (_this.form.payWay == 2||_this.form.payWay == 3){
            payType = _this.form.payAccount
          }
          let payment = {
            paymentHeadId: this.form.payWay,
            paymentName: this.form.paymentName,
            id: this.id,
            appid: this.form.APPID,
            mch_id: this.form.mchId,
            //secret: this.form.payWay == 1||this.form.payWay == 3 ? this.form.secret : '',
            secret: this.form.secret ,
            //shopKey: this.form.payWay == 1&&this.form.dictPayTypeFlagList=='H5'?this.form.shopKey:this.form.appKey,
            shopKey: this.form.payWay == 3?this.form.shopKey:this.form.appKey,
            payType: payType,
            dictStatus: this.form.dictStatus,
            gzh: null,
            andName:this.form.andName,
            andValue:this.form.andValue,
            smallProgtamOrginalid:this.form.smallProgtamOrginalid,
            mchSerialNo:this.form.mchSerialNo,
            keyV3: this.form.keyV3,
            key : this.form.certificateFile1,
            privateKey : this.form.certificateFile4
          }

         /* if (_this.form.payWay == 1) {
            if (_this.id) {//修改
              if (this.form.certificateFile1) {
                payment.key = this.form.certificateFile1;
                if(_this.form.certificateFile3&&_this.form.dictPayTypeFlagList=='H5')payment.privateKey = _this.form.certificateFile3;
              }
            } else {//新增
              if (!this.form.certificateFile1) {
                this.$message.error('请上传证书文件')
                return false;
              }
              if (!this.form.certificateFile2&&this.form.dictPayTypeFlagList=='H5') {
                this.$message.error('请上传私钥文件(apiclient_key.pem)')
                return false;
              }
              if(_this.form.dictPayTypeFlagList=='H5'){
                payment.privateKey = _this.form.certificateFile2;
              }
              payment.key = this.form.certificateFile1 ? this.form.certificateFile1 : '';
            }
          }*/

          payment.dictPayTypeFlag = this.form.dictPayTypeFlagList;
          let returnData = await saveOemPayWay(payment, {pagekey: this.pagekey})
          this.pagekey = await this.$getPageKey();
          this.addDialogVisible = false;
          if (returnData.code == 10000) {
            this.$message({
              type: 'success',
              message: '数据提交成功'
            })
          }
          this.initData()
        }
      })

    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = 1;
      this.initData();
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      this.initData();
    },
    resetForm(form) {
      this.$refs[form].resetFields();
    },
    changePayWayRadio(val){
      //this.disable = val=='2'?true:false;
      if(val==1){
        this.payFlagDisplay.JSAPI = false
        this.payFlagDisplay.NATIVE = false
        this.payFlagDisplay.H5 = false
        this.payFlagDisplay.ANDROID = true
        this.form.dictPayTypeFlagList = 'JSAPI'
      }else if(val==2){
        this.payFlagDisplay.JSAPI = false
        this.payFlagDisplay.NATIVE = true
        this.payFlagDisplay.H5 = true
        this.payFlagDisplay.ANDROID = false
        this.form.dictPayTypeFlagList = 'JSAPI'
      }else if(val==3){
        this.payFlagDisplay.JSAPI = false
        this.payFlagDisplay.NATIVE = true
        this.payFlagDisplay.H5 = true
        this.payFlagDisplay.ANDROID = true
        this.form.dictPayTypeFlagList = 'JSAPI'
        this.form.payAccount="WXZF"
      }else if(val==4){
        this.payFlagDisplay.JSAPI = false
        this.payFlagDisplay.NATIVE = true
        this.payFlagDisplay.H5 = true
        this.payFlagDisplay.ANDROID = false
        this.form.dictPayTypeFlagList = 'JSAPI'
      }
      this.form.payWay = val;

    }
  }
}
</script>
<style>
.uploadClass {
  width: 150px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 10;
}


</style>
